In this tutorial, we are going to learn how to get values from the user using a text field, text area, and checkboxes and save the values in the database.
The following is a simple Pizza order form which asks for a customer’s name, address, and extra topics customer would like to have on his/her pizza.
![](..\wp-content\uploads\2019\02\php-values-1.png)
Pizza ordering system
Create the Database
Let’s create a database called ‘pizzacorner’ for the sake of example.
![](..\wp-content\uploads\2019\02\php-values-2.png)
Create a database
Add a table
Now create the table ‘orders’ with four columns for order id, customer name, delivery address, and extra pizza toppings customer would like to have.
![](..\wp-content\uploads\2019\02\php-values-3.png)
Create Table Orders
You can use phpMyAdmin or MySQL console to create table ‘orders’.
DROP TABLE IF EXISTS `orders`; CREATE TABLE IF NOT EXISTS `orders` ( `order_id` int(11) NOT NULL AUTO_INCREMENT, `customer` varchar(200) NOT NULL, `address` varchar(250) NOT NULL, `toppings` varchar(250) NOT NULL, PRIMARY KEY (`order_id`) ) ENGINE=MyISAM AUTO_INCREMENT=7 DEFAULT CHARSET=latin1;
![](..\wp-content\uploads\2019\02\php-values-4.png)
The Table Structure
Define order_id as your primary key. Set it as auto_increment so you don’t have to add the value of order_id manually.
Create the WebForm
Create a new php file, and save it as ‘pizzaorder.php’.
Pizzaorder.php will have an html form which would take the order details from the user.
<?php if(!isset($_POST['submit'])){ ?> <div id="Pizza_order"> <h1>A simple Pizza Order Form</h1> <br/> <h3> Please enter customer's order</h3> <form action="pizzaorder_ac.php" method="post"> <p> <label>Customer Name</label><br/> <input type="text" name="customer" size="30"> </p> <p> <label>Address</label><br/> <textarea name="address" rows="4" cols="35"></textarea> </p> <p> <label>Pizza Toppings</label><br/> <input type="checkbox" name="toppings[]" value="Pepporoni"/> Pepperoni</br> <input type="checkbox" name="toppings[]" value="Sausage"/> Sausage</br> <input type="checkbox" name="toppings[]" value="BBQ Sauce"/> BBQ Sauce</br> <input type="checkbox" name="toppings[]" value="Mushrooms"/> Mushrooms</br> <input type="checkbox" name="toppings[]" value="Onions"/> Onions</br> </p> <p> <input type="submit" name="submit" value="Order Pizza"> </p> </form> </div>
and the CSS
<style> body{font-family: 'Open Sans', sans-serif; color:#333; font-size:14px; padding-left:100px;} #book_form{padding:50px;} label{display:inline-block; width:140px; } .msg{border:1px solid #28d; background-color:#9bd4f5;padding:10px; width:400px;} input[type="submit"] { background: #28d; border-color: transparent; color: #fff; cursor: pointer; padding:7px; width:200px; } .login input[type="submit"]:hover { background: #17c; } </style>
![](..\wp-content\uploads\2019\02\php-values-5.png)
The Form Layout
Create a new file ‘pizzaorder_ac.php’
<?php $customerName = htmlspecialchars(strip_tags($_POST['customer'])); $customerAddress = htmlspecialchars(strip_tags($_POST['address'])); $pizzaToppings = implode(", ",$_POST['toppings']); $conn = mysqli_connect("localhost","root","","pizzacorner"); if(!$conn){ echo "Error: Unable to connect to MySql"; die(); } $query = "insert into orders(customer, address, toppings) values('$customerName', '$customerAddress', '$pizzaToppings')"; $result = mysqli_query($conn, $query) or die("Could not execute query"); if($result){ ?> <h1>Order Details</h1> <p class="msg"> Order has been added successfully!</p> <label>Customer's Name: </label><?php echo $customer_name; ?><br/> <label>Address: </label><?php echo $customer_addr; ?> <br/> <label>Extra Toppings:</label><?php echo $pizza_toppings; ?><br/>
strip_tags() and htmlspecialchars() are two built-in PHP methods use to sanitize the user’s input.
![](..\wp-content\uploads\2019\02\php-val1.jpg)
Order Detail View
The implode() is a built-in method that joins array elements and output as a string. Implode(string $glue, array $arr) takes “, “ and $pizzaToppings as input and returns a string where each array value is separated by a comma and space.
Once we have collected user input into variables, we use these to create a query to execute.
If everything is executed fine, the data will be entered into the database and a success message will be displayed. As you can see, the data has been added successfully.
![](..\wp-content\uploads\2019\02\php-val2.jpg)
Database View
Related Articles
Comments